<template>
  <div>
    <el-dialog
        :visible.sync="dialogVisible"
        title="楼长信息"
        width="30%"
        @close="handleClose"
    >
      <div>
        <p><strong>姓名：</strong>{{ DAInfo.name }}</p>
        <p><strong>性别：</strong>{{ DAInfo.gender }}</p>
<!--        <p><strong>用户名：</strong>{{ DAInfo.username }}</p>-->
        <p><strong>电话：</strong>{{ DAInfo.telephone }}</p>
<!--        <p><strong>ID：</strong>{{ DAInfo.id }}</p>-->
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">关闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: 'DAInfoDialog',
  props: {
    DAInfo: {
      type: Object,
      required: true,
      default: () => ({
        gender: '',
        id: null,
        name: '',
        password: '',
        telephone: '',
        username: '',
      }),
    },
  },
  data() {
    return {
      dialogVisible: true,
    };
  },
  methods: {
    handleClose() {
      this.dialogVisible = false;
      this.$emit('close');
    },
  },
};
</script>

<style scoped>
.dialog-footer {
  text-align: right;
}
</style>
